<!DOCTYPE html>
<html lang="en" style="zoom: 90%">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/listings.css">
    <!-- 网站后+ /favicon.ico 提取ico图片 -->
    <link rel="shortcut icon" href="image/listings_img/favicon.ico" type="image/x-icon">
    <title>编辑列表</title>

    <style>
        .anchorBL {
            display: none;
        }
    </style>

</head>

<body style="overflow-x: hidden">
    <div class="listings-head">
        <div class="head-l fz16 c999 pinl30">
            列出您的房产
        </div>
        <div class="head-r fz16 c999 pinl30">
            预览列表
        </div>
    </div>
    <div class="listings-body">
        <div class="body-l listings1">
            <div class="lists linh">清单</div>
            <a>
                <div class="checked linh location">位置</div>
            </a>
            <a>
                <div class="Unselected linh edit txtcen location">基本</div>
            </a>
            <a>
                <div class="Unselected linh edit txtcen location">设施</div>
            </a>
            <a>
                <div class="Unselected linh edit txtcen location">照片</div>
            </a>
            <a>
                <div class="Unselected linh edit txtcen location">描述</div>
            </a>
            <a>
                <div class="Unselected linh edit txtcen location">定价</div>
            </a>
        </div>
        <div class="body-r">
            <div class="r-margin">
                <div class="r-r">
                    <div class="r-title">
                        <h3 class="fontw c444">帮助房客找到您的房源</h3>
                            <h5 class="fontw c777">旅行者将使用此信息来找到位于正确位置的地点。</h5>
                    </div>
                    <div class="r-option">
                        <div class="option-title martop">
                            <h2 class="fontw c444">国家</h2>
                        </div>
                        <div class="option-select">
                            <form action="" name="theform">
                                <select id="select_type" class="sele c777" name="province" onchange="getCity()">
                                    <option value="0">选择国家</option>
                                    <option value="1">中国</option>
                                    <option value="2">美国</option>
                                    <option value="3">泰国</option>
                                    <option value="4">瑞士</option>
                                    <option value="5">西班牙</option>
                                    <option value="6">南非</option>
                                    <option value="7">葡萄牙</option>
                                    <option value="8">摩洛哥</option>
                                    <option value="9">墨西哥</option>
                                    <option value="10">意大利</option>
                                    <option value="12">希腊</option>
                                    <option value="13">加勒比海</option>
                                    <option value="14">法国</option>
                                    <option value="15">克罗地亚</option>
                                    <option value="16">加拿大</option>
                                    <option value="17">印度尼西亚</option>
                                    <option value="18">奥地利</option>
                                    <option value="19">毛里求斯</option>
                                    <option value="20">哥斯达黎加</option>
                                    <option value="21">澳大利亚</option>
                                    <option value="22">马尔代夫</option>
                                    <option value="23">日本</option>
                                    <option value="24">新西兰</option>
                                    <option value="25">斯里兰卡</option>
                                    <option value="26">阿拉伯联合酋长国</option>
                                    <option value="27">菲律宾</option>
                                    <option value="28">越南</option>
                                    <option value="29">坦桑尼亚</option>
                                    <option value="30">荷兰</option>
                                    <option value="31">英国</option>
                                    <option value="32">塞舌尔</option>
                                    <option value="33">不丹王国</option>
                                    <option value="34">马来西亚</option>
                                    <option value="35">新加坡</option>
                                    <option value="36">大溪地群岛</option>
                                    <option value="37">斐济</option>
                                    <option value="38">芬兰</option>
                                    <option value="39">尼泊尔</option>
                                    <option value="40">俄罗斯</option>
                                    <option value="41">瑞典</option>
                                    <option value="42">土耳其</option>
                                    <option value="43">摩纳哥</option>
                                    <option value="44">切赫</option>
                                    <option value="45">冰岛</option>
                                    <option value="46">肯尼亚</option>
                                    <option value="47">马达加斯加</option>
                                    <option value="48">卢旺达</option>
                                    <option value="49">爱尔兰</option>
                                    <option value="50">挪威</option>
                                    <option value="51">老挝</option>
                                    <option value="52">埃及</option>
                                    <option value="53">韩国</option>
                                    <option value="54">阿根廷</option>
                                    <option value="55">比利时</option>
                                    <option value="56">巴西</option>
                                    <option value="57">丹麦</option>
                                    <option value="58">德国</option>
                                    <option value="59">约旦</option>
                                    <option value="60">印度</option>
                                    <option value="61">以色列</option>
                                    <option value="62">匈牙利</option>
                                    <option value="63">哥伦比亚</option>
                                    <option value="64">卡塔尔</option>
                                    <option value="65">沙特阿拉伯</option>
                                    <option value="66">巴林</option>
                                    <option value="67">智利</option>
                                    <option value="68">突尼斯</option>
                                    <option value="69">柬埔寨</option>
                                    <option value="70">缅甸</option>
                                    <option value="71">博茨瓦纳</option>
                                    <option value="72">秘鲁</option>
                                    <option value="73">阿曼</option>
                                    <option value="74">阿塞拜疆</option>
                                    <option value="75">黎巴嫩</option>
                                    <option value="76">科威特</option>
                                    <option value="77">吉尔吉斯共和国</option>
                                    <option value="78">津巴布韦共和国</option>
                                </select>
                                <select id="city" class="sele c777" onchange="getQu()">
                                    <option value="">选择城市</option>
                                </select>
                                <select id="qu" name="qu" class="sele c777" onchange="getZh()">
                                    <option value="">选择地名</option>
                                </select>
                            </form>
                            <div class="txt-address martop">
                                <h2 class="fontw c444">树状地址</h2>
                                <input type="text" class="add-txt" id="add-txt">
                            </div>
                            <div class="suite-type martop">
                                <h2 class="fontw c444">公寓，套房，建筑（可选）</h2>
                                <select class="sele c777">
                                    <option value="">房源类型</option>
                                    <option value="">别墅</option>
                                    <option value="">公寓</option>
                                    <option value="">酒店</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="map">
                    <div class="map-txt">
                        <h2 class="fontw c444">地图</h2>
                    </div>
                    <div class="map-canvas">
                        <div style="width:100%;height: 100%; margin:auto;position: relative;">
                            <p
                                style="font-family:'幼圆'; display: none; position: absolute;z-index: 1;margin-left: 20%;margin-top: 15px;">
                                <!-- <b>要查询的地址：</b><input id="address" ref="address" type="text"  /> -->
                                <input type="button" value="查询"
                                    style="width:85px; height:30px;border-color:#ccc;border: none; border-radius:25px;" />
                            </p>
                            <!-- <p style="font-family:'幼圆';display: none;">查询结果(经纬度)：<input id="result_" type="text"
                                    style="border:0;" /></p> -->
                            <center>
                                <div id="container" style="position: absolute;width:100%;height:100%;overflow:hidden;">
                                </div>
                            </center>
                        </div>
                    </div>
                    <div class="conteng c777 fontw">
                        <h5>你选择的经纬度为：</h5>
                        (<div id="address"></div>)
                    </div>
                </div>
            </div>
            <div class="next-btn fontw txtcen martop next">下一步</div>
        </div>
    </div>
</body>

<!-- 地图 -->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
<script type="text/javascript"
    src="http://api.map.baidu.com/api?ak=PlhFWpA02aoURjAOpnWcRGqw7AI8EEyO&v=2.0&services=false"></script>
<script src="jquery/jquery-3.6.0.js"></script>
<script src="js/listings1.js"></script>

<!-- 点击获取文本框的值传到下一页 -->
<script>

    // 获取从url地址截取出来的id
    function getQueryString(name) { //传进想要获取的querystring的key
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return decodeURIComponent(r[2]);
        return null;
    };

    var addvilla = new Object();

    // // 把JSON对象转化为js对象
    // addvilla = JSON.parse(getQueryString("addvilla"));
    // console.log(addvilla);

    // 点击侧边栏按钮
    $(".location").click(function () {
        if ($(this).text() == "基本") {
            var r = $("#select_type option:selected").text() + $("#city option:selected").text() + $("#qu option:selected").text();
            addvilla.villa_place = r;
            addvilla.user_id = getQueryString("user_id");
            // 通过url传递对象，需要将对象转换为JSON字符串
            window.location.href = "listings2.html?addvilla=" + JSON.stringify(addvilla);
        }

        if ($(this).text() == "设施") {
            var r = $("#select_type option:selected").text() + $("#city option:selected").text() + $("#qu option:selected").text();
            addvilla.villa_place = r;
            addvilla.user_id = getQueryString("user_id");
            // 通过url传递对象，需要将对象转换为JSON字符串
            window.location.href = "listings3.html?addvilla=" + JSON.stringify(addvilla);
        }

        if ($(this).text() == "照片") {
            var r = $("#select_type option:selected").text() + $("#city option:selected").text() + $("#qu option:selected").text();
            addvilla.villa_place = r;
            addvilla.user_id = getQueryString("user_id");
            // 通过url传递对象，需要将对象转换为JSON字符串
            window.location.href = "listings4.html?addvilla=" + JSON.stringify(addvilla);
        }

        if ($(this).text() == "描述") {
            var r = $("#select_type option:selected").text() + $("#city option:selected").text() + $("#qu option:selected").text();
            addvilla.villa_place = r;
            addvilla.user_id = getQueryString("user_id");
            // 通过url传递对象，需要将对象转换为JSON字符串
            window.location.href = "listings5.html?addvilla=" + JSON.stringify(addvilla);
        }

        if ($(this).text() == "定价") {
            var r = $("#select_type option:selected").text() + $("#city option:selected").text() + $("#qu option:selected").text();
            addvilla.villa_place = r;
            addvilla.user_id = getQueryString("user_id");
            // 通过url传递对象，需要将对象转换为JSON字符串
            window.location.href = "listings6.html?addvilla=" + JSON.stringify(addvilla);
        }
    })

    // 点击下一个按钮
    $(".next").click(function () {
        var r = $("#select_type option:selected").text() + $("#city option:selected").text() + $("#qu option:selected").text();
        addvilla.villa_place = r;
        addvilla.user_id = getQueryString("user_id");
        // 通过url传递对象，需要将对象转换为JSON字符串
        window.location.href = "listings2.html?addvilla=" + JSON.stringify(addvilla);
    })

</script>

</html>